﻿@model HelloMinasan.Web.Song.ViewModels.RegisterModel

@{
    ViewBag.Title = "Sign Up";
}
<link href="~/Content/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript">
    $(document).ready(function () {

        $("#DateOfBirth").datepicker({
            dateFormat: 'mm/dd/yyyy',
            showButtonPanel:  false,
            constrainInput: true
        });
    });
</script>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

@using (Html.BeginForm("Register", "Account", FormMethod.Post))
{
    <div style=" background-color:#F8FFE9; min-height: 400px;">
        <div style="float: left; width: 400px;">
            <fieldset style="min-height: 388px; border-color: blue;">
            <legend><h1 style="color:blue;">@ViewBag.Title</h1></legend>
            <div class="editor-field">
                @Html.TextBoxFor(m => m.UserName, new {@placeholder="Enter user name", style="Width: 200px;height: 20px;" })
                @Html.ValidationMessageFor(m => m.UserName)
            </div>
            <div class="editor-field">
                @Html.TextBoxFor(m => m.FullName, new {@placeholder="Enter full name", style="Width: 200px;height: 20px;" })
                @Html.ValidationMessageFor(m => m.FullName)
            </div>
            <div class="editor-field">
                @Html.TextBoxFor(m => m.Email, new {@placeholder="Enter your email", style="Width: 200px;height: 20px;" })
                @Html.ValidationMessageFor(m => m.Email)
            </div>
            <div class="editor-field">
                @Html.PasswordFor(m => m.Password, new {@placeholder="Enter your password", style="Width: 200px;height: 20px;" })
                @Html.ValidationMessageFor(m => m.Password)
            </div>           
            <div class="editor-field">
                @Html.PasswordFor(m => m.ConfirmPassword, new {@placeholder="Enter confirm password", style="Width: 200px; height: 20px;" } )
                @Html.ValidationMessageFor(m => m.ConfirmPassword)
            </div> 
             <div style="font-size: 14px; margin-top: 20px;">
                @Html.Label("Your birthday")
            </div>
             @*@Html.TextBoxFor(m => m.DateOfBirth, new { @type="date",style = "text-align: center; float:left;Width: 200px;margin-top:10px;", maxlength = 50, @Value = DateTime.Now.ToString("MM/dd/yyy") })*@
             @Html.DropDownListFor(m => m.Month, (SelectList)ViewBag.Months, new {@class="dropdatebox"}) @Html.DropDownListFor(m => m.Day, (SelectList)ViewBag.Days, new { style = "margin-left:15px;",@class="dropdatebox" }) @Html.DropDownListFor(m => m.Year, (SelectList)ViewBag.Years, new { style = "width: 70px;margin-left:15px;" ,@class="dropdatebox"})
             <div style="clear:both;color:red;">
             @Html.ValidationMessageFor(m => m.Day)
             @Html.ValidationMessageFor(m => m.Month)
             @Html.ValidationMessageFor(m => m.Year)
             </div>
            <p style="clear: both;">
                <input id="Save" name="Save" type="submit" value="Sign Up" style=" margin-top: 20px; "/>
            </p>           
        </fieldset>
        </div>
        <div id="" name="" class="" style="float:left; width:520px; height: 300px; text-align:center;"><h1>Learning English By Song</h1><br/><h2>It’s free to register a new account</h2></div>
        
    </div>
    
}
